<template>
<div class="regebang">
	<div class="hotop">
		<div class="hotopct">
			<div class="hoticon">
				
			</div>
			<div class="hottime">
				更新日期：11月01日
			</div>
		</div>
	</div>
</div>
</template>

<script>
	
	
	export default {
		name:'regebang',
	}
</script>

<style lang="scss">
@import '../scss/common';
@import '../scss/reset';
	
	.regebang{
		margin-top: r(208px);
	}
	.hotop{
		position: relative;
	    padding-top: 38.9%;
	    overflow: hidden;
	    background: url(../../public/img/hot_music_bg_2x.jpg) no-repeat;
	    background-size: contain;
	    .hotopct{
	    	position: absolute;
	    	left: 0;
		    top: r(-12px);
		    right: 0;
		    bottom: 0;
	    	display: -webkit-box;
		    display: -webkit-flex;
		    display: flex;
		    -webkit-box-orient: vertical;
		    -webkit-box-direction: normal;
		    -webkit-flex-direction: column;
		    flex-direction: column;
		    -webkit-box-pack: center;
		    -webkit-justify-content: center;
		    justify-content: center;
		    z-index: 2;
		    padding-left: r(40px);
		    box-sizing: border-box;
		    .hoticon{
		    	width: r(284px);
			    height: r(134px);
			   
			    background: url(../../public/img/index_icon_2x.png) no-repeat;
    			background-size: r(332px) r(194px);
    			 background-position: r(-48px) r(-60px);
		    }
	    }
	}
	.hottime{
		text-align: left;
		margin-top: 10px;
	    color: hsla(0,0%,100%,.8);
	    font-size: 12px;
	    -webkit-transform: scale(.91);
	    transform: scale(.91);
	    -webkit-transform-origin: left top;
	    transform-origin: left top;
	}
</style>